<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <? // Author: Mohamed Abdel Hakim ?>
        <link rel="shortcut icon" type="image/x-icon" href="menu icons/favicon.ico">
        <title>Home page</title>
        <meta http-equiv="X-UA-Compatible" content="IE=9" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="style3.css" rel="stylesheet" type="text/css" />
        <?php include "jquery.php" ?>
        <script type="text/javascript" src="fading.js"></script>
        <script type='text/javascript'>
            $(document).ready(function(){
                  if (navigator.appName == "Microsoft Internet Explorer")
            {
             alert("The system detectts that you are using an old version of Internet Explorer, please open the site in Chrome or Firefox to be able to access all website functionalities");
        }
                $('#collabsoft').load (function() { // function to make the iframe auto resize it's height according to the height of the content
                        $(this).height($(this).contents().find("html").height()+300);

                });
            });
        </script>
        <script>
            $(document).ready(function () {
                $('#nav a').click(function () {
                    $('#nav a').removeClass('selected');
                    $(this).addClass('selected');
                });
                if ($("#nav").is(':visible')) {

                    $("#collabsoft").attr("width", "80%"); // setting the width of the iframe if the menu is visible or not
                }
                else {
                    $("#collabsoft").attr("width", "100%");
                }
                $vis = 1;
                $(".flip").click(function () { // click function to show hide the menu and animate the iframe to fit the whole width of the page
                    if ($vis) {
                        $vis = 0;
                        $("#nav").animate({left:'-=250px'}, 'slow');
                        jQuery("#collabsoft").animate({width: '100%'}, 'slow');
                    }
                    else {
                        $vis = 1;
                        $("#nav").animate({left:'+=250px'}, 'slow');
                        jQuery("#collabsoft").animate({width: '80%'}, 'slow');
                    }
                });
                return false;
            });

        </script>
        <style>
            .flip
            {
                cursor: pointer;
                text-align:center;
                background:white;
                border: inset 5px #c3c3c3;
                height: 30px;
                float: left;
            }
        </style>

    </head>
    <body>
        <?php
        // start a session
        session_start();
        if (isset($_GET['new'])) {// if it is the user's first logging in a welcoming message is displayed
            ?>
            <script type="text/javascript">
                display_alert("welcome to confO!");
                //document.getElementById("collabsoft").src = "";
            </script>
            <?php
        }
        //Database Connection
        $conn = @mysql_connect("localhost", "root", "") or die(mysql_error());
        mysql_select_db("mydb") or die(mysql_error());

        $email = $_SESSION ['email']; //call the email session as it's needed to get the signed in user id
        $userid = mysql_query("Select m.member_id From member m, emails e Where (m.member_id = e.member_id AND e.email = '$email')OR(m.email = '$email')") or die(mysql_error()); //retrieved the user's id from the database by his email

        $row = mysql_fetch_assoc($userid);
        //echo $row ['member_id'];
        $_SESSION['member_id'] = $row['member_id']; // make the signed in user id globaly viewed as it's needed everywhere in the website
        //include 'Footer.php';
        ?>
        <p align="center"><img src="ConfO-logo.png"/></p>
        <fieldset style="background-color: #003366;  height: fit-content;">
            <div class="logout" style="border:5px #c3c3c3 inset; background-color: white">
                <form method="post" action="Signout.php">
                    <?php
                    if (isset($email)) {
                        echo $email;
                    } else {
                        echo "<script>window.location='index.php'</script>";
                    }
                    ?>
                    &nbsp;<a style="font-weight: bold;" href="Signout.php">Sign Out</a>
                </form>
            </div>
             <div>  <button id="bt" class="flip">Show/Hide menu</button></div>
              <div style="float: bottom;">
             <?php
            $news = mysql_query("SELECT ann_title, ann_text FROM o_postnews_conference");
            echo "<marquee scrollamount='3'><font color='snow'>";
           echo "<strong>latest news.....  </strong>";
            while ($row = mysql_fetch_assoc($news))
                echo "<strong>{$row['ann_title']}:</strong> {$row['ann_text']}     ----------------------------     ";
            echo "</font></marquee>";
            ?>
            </div>
        </fieldset>
        <div id="nav" class="mmenu" style="float: left; position: fixed;
             left: 10px;">
            <ul type="none">
                <? //reference all buttons in the main menu to their pages   ?>
                <? //reference all buttons i%n the main menu to their pages  ?>
                <li><a id="1" style="border-top-left-radius: 6px; border-top-right-radius: 6px; background-image:url('menu icons/user-blue.gif'); background-repeat: no-repeat; background-position: left; background-position-x: 5px;" target="collabsoft" href= "ProfilePage.php?property_variable=mine">My Profile</a></li>
                <li><a id="2" style="background-image:url('menu icons/comments.png'); background-repeat: no-repeat; background-position: left; background-position-x: 5px;"  target="collabsoft" href= "viewMessages.php">Messages</a></li>
                <li><a id="3" style="background-image:url('menu icons/newspaper.gif'); background-repeat: no-repeat; background-position: left; background-position-x: 5px;"  target="collabsoft" href= "userHomepage.php">My Conferences</a></li>
                <li><a id="4" style="background-image:url('menu icons/pageflip.gif'); background-repeat: no-repeat; background-position: left;background-position-x: 2px;"  target="collabsoft" href= "availableConferences.php">Conferences</a></li>
                <li><a id="5" style="background-image:url('menu icons/users.gif'); background-repeat: no-repeat; background-position: left; background-position-x: 5px;"  target="collabsoft" href= "incomingRequests.php">Requests</a></li>
                <li><a id="6" style="background-image:url('menu icons/book.gif'); background-repeat: no-repeat; background-position: left;background-position-x: 5px;"   target="collabsoft" href= "viewNews.php" >News</a></li>
                <li><a id="7" style="border-bottom-left-radius: 6px; border-bottom-right-radius: 6px; background-image:url('menu icons/gear.gif'); background-repeat: no-repeat; background-position: left;background-position-x: 5px;" target="collabsoft" href= "generalOptions.php" >Options</a></li>
            </ul>
        </div>
        <iframe scrolling="no" id="collabsoft" name="collabsoft" src="latestNews.php" style="position: relative;
                height: 900px; float:right; border: 0px; top: 20px;border-radius: 10px; overflow: auto;"></iframe>
        <div style="height: 350px;"></div>
        <footer class="footer" id="footer">
            <a target="collabsoft" href="aboutUs.php">About Us</a> |
            <a target="collabsoft" href="termsOfService.php">Terms of Service</a> |
            <a target="collabsoft" href="privacyPolicy.php">Privacy Policy</a>
        </footer>
        <a style="float: left; position: fixed; bottom: 0px;" href="#top" id="toplink">Go to the top</a>
    </body>
</html>

